<template>
    <div>
        <el-date-picker
            v-model="value1"
            type="date"
            format="YYYY-MM-DD"
            placeholder="请输入"
        />
        <msgShow :city="city" @changeMsg="changeMsg" />
        <div>{{ city }}</div>

    </div>
    
    <animation />


    <charts />
   
    
</template>

<script>
import msgShow from "@/components/MsgShow";
import animation from '@/components/animation.vue'
import charts from '@/components/charts.vue'
import { reactive, ref, toRefs } from "vue";
export default {
    components: {
        msgShow,
        animation,
        charts
    },
    setup() {
        let value1 = ref("");
        let vueData = reactive({
            city: "上海市",
        });

        function changeMsg(city) {
            vueData.city = city;
        }


        return {
            ...toRefs(vueData),
            value1,
            changeMsg,
        };
    },
};
</script>

<style lang="scss" scoped></style>
